<template>
  <el-form :model="form" label-width="120px">
    <el-form-item label="账号">
      <el-input v-model="form.account" />
    </el-form-item>
    <el-form-item label="密码">
      <el-input v-model="form.password" />
    </el-form-item>

      <el-form-item>
      <el-button type="primary" @click="onSubmit">Create</el-button>
      <el-button>Cancel</el-button>
    </el-form-item>

  </el-form>
</template>

<script lang="ts" setup>
import { reactive } from 'vue'
import {useStore}  from 'vuex';
import {useRouter}  from 'vue-router'
import {login}  from '../api/login.js'
const router = useRouter()
const store  = useStore();
// do not use same name with ref
const form = reactive({
  account: '',
  password: '',
})

const onSubmit = () => {
  login({account:form.account,password:form.password}).then(res=>{
      localStorage.setItem('token',res.data.token);
      router.push('/index');
  })
}
</script>
